/**
 * 月流量统计图数据
 */
function loadOctetChartData(chartContainerId,chart,type){
	var flagDivId=chartContainerId+'_flag';
	$('#'+flagDivId).html('加载流量信息...');

	function getCategories(dateStr){
		//yyyy-MM-dd-HH
		if(type=='year'){
			return dateStr.substring(5)+'月';
		} else if(type=='month'){
			return dateStr.substring(8)+'日';
		} else if(type=='day'){
			return dateStr.substring(11)+'时'
		}
		return dateStr;
	}
	var serieOct = chart.series[0];
	var serieOct2 = chart.series[1];
	var serieUser = chart.series[2];
	var xAxis = chart.xAxis[0];
	var typeCN = '';//汉字描述
	var url = 'radAcct!octetAndUsers.action';
	if(type=='year') {
		url+='?year=1';
		typeCN = '年';
	}
	else if(type=='month') {
		url+='?month=1';
		typeCN = '月';
	}
	else if(type=='day') {
		url+='?day=1';
		typeCN = '日';
	}
	$.getJSON(url,function(result){
		 if(result.success){
			
			var octArr = [];
			var octArr2 = [];
			var sumUserArr = [];
			var categories = [];
			for(var i=0;i<result.rows.length;i++){
				var r = result.rows[i];
				var x = r.date;
				var cat = getCategories(x);
				categories.push(cat);
				
				var oct = Math.round(r.sumOct/1024/1024*100)/100;
				var oct2 = Math.round(r.sumOct2/1024/1024*100)/100;
				octArr.push(oct);
				octArr2.push(oct2);
				sumUserArr.push({
					name:cat,
					y:r.sumUser,
					oct:oct,
					oct2:oct2
				});
			}
			
			if(result.data!=null){
				var oct = Math.round(result.data.sumOct/1024/1024/10.24)/100;
				var oct2 = Math.round(result.data.sumOct2/1024/1024/10.24)/100;
				$('#'+flagDivId).html('<font style="weight:bold;color:blue">'+result.data.date+'</font> '+typeCN+' <font style="color:red">'+result.data.sumUser+'</font> 人使用,实际流量：<font style="color:red">'+oct+'</font> Gb，计费流量：<font style="color:red">'+oct2+'</font> Gb。');
				//chart.setSubTitle({text:'流量概览 ( 本月实际流量:'+Math.round(result.data.sumOct/1024/1024/10.24)/100+' Gb )'});
			} else {
				$('#'+flagDivId).html('无流量信息');
			}
			if($('#'+chartContainerId).is(':hidden')){
				return ;
			}
			serieOct.setData(octArr);
			serieOct2.setData(octArr2);
			serieUser.setData(sumUserArr);
			xAxis.setCategories(categories);
			chart.init = true;
		}
	});
}
/**
 * 月流量统计图
 * @param elId
 */
function renderOctetChart(elId){
	
	var chart = new Highcharts.Chart({
		chart: {
			renderTo: elId,
			//type: 'column',
			backgroundColor:'none',
			borderColor: '#aaa',
		    borderWidth: 1,
		    zoomType: 'xy'
		},
		title: {
			text: '流量概览'
		},
		
		credits: {
			enabled: false
		},
		xAxis: {
			categories: [],
			labels: {
				rotation: -45,
				align: 'right',
				style: {
					font: 'normal 13px Verdana, sans-serif'
				}
			}
		},
		yAxis: [{
			min: 0,
			title: {
				text: '流量(M)'
			}
		},{
			title: {
				text: '使用情况',
				style: {
					color: '#89A54E'
				}
			},
			labels: {
				formatter: function() {
					return this.value +' 人';
				},
				style: {
					color: '#4572A7'
				}
			},
			min:0,
			minRange:1,
			tickInterval:100, //坐标轴单位宽度  
			opposite: true
		}],
		tooltip: {
			formatter: function() {
				if (this.point.name) { // the pie chart
					return '<span style="color:blue">'+this.point.name+'</span>: <span style="color:red">'+ this.y+'</span> 人使用<br/>'
						+'实际流量: <span style="color:red">'+this.point['oct']+'</span> M<br/>'
						+'计费流量:<span style="color:red">'+this.point['oct2']+'</span> M';
				} else {
					return this.series.name+'<br/>'+
					this.x +': '+ this.y +' M';y;
				}
				
			}
		},
		plotOptions: {
			column: {
				pointPadding: 0.2,
				borderWidth: 0
			}
		},
		series: [{
			name: '总流量',
			type: 'column',
			data:[],
			type:'areaspline'
		},{
			name: '比率流量',
			type: 'column',
			data: []
		},{
			type: 'spline',
			name: '使用情况',
			data: [],
			yAxis: 1
		}]
	});
	return chart;
}

/**
 * 当前用户
 */
function loadCurrentStatusChartData(containerId,chart){
	var serieUser = chart.series[0];
	var serieOct = chart.series[1];
	if(!chart.init){
		//初始化
		$.getJSON('radAcct!historyUserAndOcts.action?fetchHistorySpan=8&d='+new Date().getTime(),function(result){
			if(result.success){
				var dataUser = [],dataOct = [];
				var currentUser = 0;
				var currentOct = 0;
				for(var i=0;i<result.rows.length;i++){
					var x = result.rows[i].time;
					var y1 = result.rows[i].onlineNum;
					var y2 = Math.round(result.rows[i].activeOctets/1024/10.24)/100;
					dataUser.push({
						x: x,
						y: y1
					});
					dataOct.push({
						x: x,
						y: y2
					});
					currentUser = y1;//最后一个
					currentOct = y2;
				}
				serieUser.setData(dataUser);
				serieOct.setData(dataOct);
				chart.setTitle({text:'当前: <span style="color:#4572A7">'+y1+'</span> 人在线,活跃流量 <span style="color:#89A54E">'+currentOct+'</span> M'});
				chart.init = true;
			}
			//setTimeout('loadCurrentStatusChartData()',60*1000);
		});
		
	} else {
		$.getJSON('radAcct!currentUserAndOctets.action?d='+new Date().getTime(),function(result){
			if(result.success){
				var x = result.data.time;
				var y1 = result.data.onlineNum;
				var y2 = Math.round(result.data.activeOctets/1024/10.24)/100;
				if(!chart.init){
					var dataUser = [],dataOct = [];
					var t = x;
					for (var i = -9; i <= -1; i++) {
						dataUser.push({
							x: t + i * 60000,
							y: 0
						});
						dataOct.push({
							x: t + i * 60000,
							y: 0
						});
					}
					serieUser.setData(dataUser);
					serieOct.setData(dataOct);
				}
				serieUser.addPoint([x, y1], false, true);
				serieOct.addPoint([x, y2], false, true);
				//chart.setTitle({text:'在线用户数(当前: '+y1+' 人)'});
				chart.setTitle({text:'当前: <span style="color:#4572A7">'+y1+'</span> 人在线,活跃流量 <span style="color:#89A54E">'+y2+'</span> M'});
				chart.init = true;
				if(!($('#'+containerId).is(':hidden'))){
					chart.redraw();
				}
			}
			//setTimeout('loadCurrentStatusChartData()',60*1000);
		});
	}
}

function renderCurrentStatus(divId){
	
	return  new Highcharts.Chart({
		credits: {
			enabled: true,
			href: 'http://www.ChinaUnicom.com',
			text: "中国联通"
		},
		chart: {
			renderTo: divId,
			zoomType: 'xy',
			backgroundColor:'none',
			borderColor: '#aaa',
		    borderWidth: 1
		},
		title: {
			text: '活跃用户及流量趋势'
		},
		subtitle: {
			text: '每 1 分钟刷新一次'
		},
		xAxis: {
			type: 'datetime'
		},
		yAxis: [{ // Primary yAxis
			labels: {
				formatter: function() {
					return this.value +'M';
				},
				style: {
					color: '#666999'
				}
			},
			title: {
				text: '活跃流量',
				style: {
					color: '#89A54E'
				}
			},
			min:0,
			minRange:1,
			opposite: true

		}, { // Secondary yAxis
			gridLineWidth: 0,
			min:0,
			minRange:1,
			tickInterval:50, //坐标轴单位宽度  
			title: {
				text: '活跃用户',
				style: {
					color: '#4572A7'
				}
			},
			labels: {
				formatter: function() {
					return this.value +' 人';
				},
				style: {
					color: '#4572A7'
				}
			}

		}],
		tooltip: {
			formatter: function() {
				var unit = {
					'活跃用户': '人',
					'活跃流量': 'M'
				}[this.series.name];

				return this.series.name+': <span style="color:blue">'+this.y +'</span> '+ unit+'<br/>时间:'+Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.x);
			}
		},
		legend: {
			backgroundColor: '#FFFFFF'
		},
		series: [{
			name: '活跃用户',
			color: '#4572A7',
			type: 'spline',
			yAxis: 1,
			//data: [49.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
			data: []
		},  {
			name: '活跃流量',
			color: '#89A54E',
			type: 'spline',
			//data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
			data:[]
		}]
	});
}
